<template>
    <div>
        <Row>
            <Form inline :label-width="90" class="search-form" style="margin-left:-25px;">
                <FormItem label="规则名称" prop="ruleName" style="width:300px">
                    <Input type="text" v-model="searchForm.ruleName" clearable placeholder="请输入关键字" style="width: 200px"/>
                </FormItem>
                <FormItem label="状态" prop="ruleState" style="width:300px">
                    <Select v-model="searchForm.ruleState" clearable placeholder="请选择渠道类型" style="width:200px">
                        <Option value="1">失效</Option>
                        <Option value="2">生效</Option>
                    </Select>
                </FormItem>
                <Form-item style="margin-left:-45px;" class="br">
                    <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
                    <Button @click="handleReset">重置</Button>
                </Form-item>
            </Form>
        </Row>
        <Row>
            <Button @click="add" type="primary" icon="md-add">规则添加</Button>
        </Row>
        <div style="margin-top:10px;">
            <rui-page :defines="defines">
                <rui-table :defineId="'approveRickInfo'"
                           :slots="[{key:'action',slot:'action'}]"
                           :select="true"
                           :showIndex="false"
                           @loadDatas="getApproveList"
                           ref="approveRickInfoTable">
                    <template slot="action" slot-scope="{ row, index }">
                        <Button @click="edit(row)" size="small" type="primary">编辑</Button>
                        <Button @click="configure(row)" size="small" type="error">规则配置</Button>
                        <Button v-if="row.ruleId!==undefined&&row.ruleState==='1'" style="margin-right:5px" type="warning" size="small"
                                @click="invalid(row)">生效
                        </Button>
                        <Button v-if="row.ruleState==='2'" style="margin-right:5px" type="success" size="small"
                                @click="invalid(row)">失效
                        </Button>
                    </template>
                </rui-table>
            </rui-page>
        </div>
        <div>
            <Modal :title="approveRickTitle" v-model="approveRickModalVisible" :mask-closable='false' :width="500" :height="100" >
                <Form ref="approveRickForm" :model="approveRickForm" :label-width="80" :rules="approveRickFormValidate" style="margin-left: 75px;width: 300px">
                    <FormItem label="规则名称" prop="ruleName">
                        <Input v-model="approveRickForm.ruleName"/>
                    </FormItem>
                    <FormItem label="风险提示" prop="remarks">
                        <Input v-model="approveRickForm.remarks" maxlength="500" show-word-limit type="textarea" :autosize="{minRows: 5}" style="width:300px;"  placeholder="请输入..."/>
                    </FormItem>
                </Form>
                <div slot="footer">
                    <Button type="text" @click="cancelLoanRisk">取消</Button>
                    <Button type="primary" :loading="submitLoading" @click="submit">提交</Button>
                </div>
            </Modal>
        </div>
        <div>
            <Modal v-model="ruleModal" :width="1100" :styles="{top: '90'}" @on-cancel="cancel" :footer-hide="true" style="margin-left: 300px">
                <p slot="header" style="color:#f60;text-align:center">
                    <Icon type="ios-information-circle"></Icon>
                    <span>风险提示规则配置</span>
                </p>
                <Row>
                    <Card style="margin-top:-15px">
                        <rule-tree v-if="dataLoad" @saved="ruleSaved" :readOnly="ruleReadOnly"
                                   :rule-data="ruleData"
                                   :ruleAtoms="ruleAtoms" :rule-id="ruleId" :ruleName="ruleName" :ruleGroup="ruleGroup" :businessScenario="businessScenario"/>
                    </Card>
                </Row>
            </Modal>
        </div>
    </div>
</template>
<script>
    let approveRickInfo = [
        {
            key: 'action',
            title: '操作',
            align: 'center',
            slot: 'action'
        },
        {
            key: 'ruleName',
            title: '规则名称',
            align: 'center',
        },
        {
            key: 'remarks',
            title: '风险提示',
            align: 'center',
        },
        {
            key: 'ruleState',
            title: '状态',
            align: 'center',
            render: (h, params) => {
                let text = '';
                let color = '';
                let arr = params.row.ruleState;
                let id = params.row.ruleId;
                if(id!==undefined&&arr==="1"){
                    text = '失效';
                    color = '';
                }else if (arr==="2"&&id!=="") {
                    text = '生效';
                    color = 'lightgreen';
                }else if(id===undefined&&arr==="1"){
                    text = '未创建';
                }
                return h('Tag', {
                        props: {
                            type:"dot",
                            color: color
                        }
                    },
                    text,
                )
            }
        },
        {
            key: 'createTime',
            title: '创建时间',
            align: 'center',
            format:'yyyy-MM-dd'
        }
    ];
    import {saveOrUpdateApproveRisk,getApproveRuleInfo,updateApproveRiskRule} from "@/projects/afs-core-business/api/afs-case/approve-risk-tips-rule/approveRiskTipsRule";
    import ruiRules from '_c/rui-auto/rui-rules/index'
    import {loadRuleDataById} from '_p/basic/api/rule/rule'
    import {queryAtomsByBizType} from '_p/basic/api/rule/ruleAtom'
    export default {
        components: {
            ruleTree:ruiRules
        },
        data() {
            return{
                modalType:"",
                approveRickTitle:"",
                approveRickModalVisible:false,
                attachmentClassList:[],
                approveRickForm:{
                    id:"",
                    remarks:"",
                    ruleName:"",
                },
                approveRickFormValidate:{
                    remarks: [{required: true, message: "风险提示不能为空", trigger: "change"}],
                    ruleName: [{required: true, message: "规则名称不能为空", trigger: "change"}]
                },
                searchForm:{
                    pageNumber: 1,
                    pageSize: 10,
                    ruleName:"",
                    ruleState:"",
                },
                total:0,
                pageNumber: 1,
                pageSize: 10,
                submitLoading:false,
                //规则变量
                ruleModal:false,
                ruleAtoms:[],
                ruleName:'信审风险提示',
                ruleGroup:'',
                businessScenario:'',
                ruleData:[],
                dataLoad:false,
                bizType: 'approveRisk',
                ruleId:'',
                ruleReadOnly:false
            }
        },
        methods: {
            init(){
                this.getApproveList(1,10);
            },
            //搜索
            handleSearch(){
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getList();
            },
            //重置
            handleReset(){
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.searchForm.ruleName = "";
                this.searchForm.ruleState = "";
                this.getList();
            },
            //新增
            add(){
                this.modalType = 0;
                this.approveRickTitle = "风险提示规则新增";
                this.$refs.approveRickForm.resetFields();
                this.approveRickModalVisible = true;
            },
            //编辑
            edit(v){
                this.modalType = 1;
                this.approveRickTitle = "风险提示规则编辑";
                for (let attr in v) {
                    if (v[attr] === null) {
                        v[attr] = "";
                    }
                }
                let str = JSON.stringify(v);
                let member = JSON.parse(str);
                this.approveRickForm = member;
                this.approveRickModalVisible = true;
                this.$refs.approveRickForm.resetFields();
            },
            //失效,失效
            invalid(row){
                updateApproveRiskRule(row).then(res=>{
                    if(res.code==="0000"){
                        this.$Message.success("操作成功");
                        this.getList();
                    }
                })
            },
            cancelLoanRisk(){
                this.approveRickModalVisible = false;
            },
            //提交
            submit(){
                this.$refs.approveRickForm.validate(valid => {
                    if(valid){
                        if(this.modalType === 0){
                            saveOrUpdateApproveRisk(this.approveRickForm).then(res=>{
                                if(res.code === "0000"){
                                    this.$Message.success("操作成功");
                                    this.getList();
                                    this.approveRickModalVisible = false;
                                }
                            })
                        }else{
                            saveOrUpdateApproveRisk(this.approveRickForm).then(res=>{
                                if(res.code === "0000"){
                                    this.$Message.success("操作成功");
                                    this.getList();
                                    this.approveRickForm.id = "";
                                    this.approveRickForm.remarks = "";
                                    this.approveRickForm.ruleName = "";
                                    this.approveRickModalVisible = false;
                                }
                            })
                        }
                    }
                })
            },
            ruleSaved(ruleId){
                this.ruleModal = false;
                this.cancel();
                this.getList();
            },
            getList() {
                getApproveRuleInfo(this.searchForm).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        let {records, total} = res.data;
                        this.$refs.approveRickInfoTable.updateTableData(records, total);
                    }
                });
            },
            getApproveList(pageNumber, pageSize){
                this.searchForm.pageNumber = pageNumber;
                this.searchForm.pageSize = pageSize;
                getApproveRuleInfo(this.searchForm).then(res=>{
                    if(res.code === "0000"){
                        let {records, total} = res.data;
                        this.$refs.approveRickInfoTable.updateTableData(records, total);
                    }
                })
            },
            //规则配置
            configure(v){
                if(v.ruleState==="2"&&v.ruleId!==undefined){
                    this.ruleReadOnly = true;
                }else{
                    this.ruleReadOnly = false;
                }
                this.ruleModal = true;
                if(v.ruleId!==undefined){
                    this.ruleId = v.ruleId;
                    this.businessScenario = v.id;
                }else {
                    this.ruleId = "";
                    this.businessScenario = v.id;
                }
                this.ruleGroup = "approveRisk";
                this.queryRuleDataById();
                this.queryRuleAtomInfo();
            },
            queryRuleDataById(){
                loadRuleDataById((this.ruleId&&this.ruleId!='')?this.ruleId:undefined,"case").then(res=>{
                    if(res.code='0000'){
                        if(res.data.length>0) {
                            this.ruleData.push(...res.data);
                        }
                        this.dataLoad = true;
                    }
                });
            },
            queryRuleAtomInfo(){
                queryAtomsByBizType(this.bizType,"case").then(res=>{
                    if(res.code=="0000"){
                        this.ruleAtoms = res.data;
                    }
                })
            },
            cancel () {
                this.ruleId = '';
                this.ruleData = [];
                this.dataLoad = false;
                this.businessScenario = '';
            },
        },
        //初始化
        mounted() {
            this.init();
        },
        computed: {
            defines() {
                return [
                    {
                        id: 'approveRickInfo',
                        fields: approveRickInfo
                    }
                ]
            }
        },
    }
</script>
